<template>
    <div class="login">
        <div class="heig"></div>
        <div class="bian">
            <el-menu :default-active="activeIndex2" class="el-menu-demo">
                <el-menu-item index="1">订单后台管理</el-menu-item>
            </el-menu>
            <el-radio-group v-model="labelPosition" size="small">
            </el-radio-group>
            <div style="margin: 20px;"></div>
            <el-form :label-position="labelPosition" label-width="70px" label-color="white" :model="formLabelAlign">
                <el-form-item label="账号">
                    <el-input v-model="formLabelAlign.name" placeholder='请输入账号' class=" inp" @keyup.enter.native="adminlogin"></el-input>
                </el-form-item>
                <el-form-item label="密码">
                    <el-input type="password" v-model="formLabelAlign.region" placeholder='请输入密码' class=" inp" @keyup.enter.native="adminlogin"></el-input>
                </el-form-item>
                <div class="login_ang">
                    <el-button type="primary" class="log_in" @click="adminlogintwo">登陆</el-button>
                </div>
            </el-form>
        </div>
    </div>
</template>
<script>
import bg from '~/ecshop-bg.png'
export default {
    name: 'login',
    components: {
    },
    data() {
        return {
            labelPosition: 'right',
            formLabelAlign: {
                name: '',
                region: '',
            },
            activeIndex2: '1',

        }
    },
    methods: {
        adminlogintwo() {
            this.ajaxretin()
        },
        adminlogin(ev) {
            if (ev.keyCode == 13) {
                this.ajaxretin()
            }
        },
        ajaxretin() {
          if(this.formLabelAlign.name == this.$store.state.attribute.name && this.formLabelAlign.region == this.$store.state.attribute.password){
            this.$store.commit('updateflag',215);
            this.$router.push('/tablepage')
          }else{
            this.$notify.error({
              title: '错误',
              message: '密码或账号错误'
            });
          }

        },
    },
    watch: {

    },
    computed: {
        //计算属性
    },
    mounted() {
//      console.log(this.excel)
        //生命周期
        document.body.style.background = `url(${bg})`;
        document.body.style.backgroundSize = 'cover';
        // console.log(this.HOST.adminlogin)

    }
}
</script>
<style scoped>
.login {
    width: 100%;
    height: 100%;
  padding-top: 14%;
}

.bian {
    background: white;
    width: 500px;
    height: 300px;
    border: 1px solid gray;
    margin: auto;
}

.inp {
    width: 80%;
}

.login_ang {
    width: 25%;
    height: 50px;
    margin: auto;
}

.log_in {
    width: 100%;
}

.heig {
    height: 30%;
}
</style>
